<template>
  <div class="main-box">
    <div class="categoryTree" style="width: 240px">
      <el-button type="primary" @click="addKnowledgeBtn" style="width: 220px; margin: 0 auto; margin-bottom: 10px" v-auth="'add'">
        新增
      </el-button>
      <!-- <el-button type="success" @click="checkKnowledge" style="width: 220px; margin: 0 auto"> 审核 </el-button> -->
      <TreeFilter
        label="data"
        id="attr"
        title="知识库分类"
        :data="treeFilterData"
        :default-value="initParam.knowledgeId"
        @change="changeTreeFilter"
        style="width: 220px; height: 93.2%; margin-top: 10px"
      />
    </div>

    <div class="table-box">
      <div>
        <div style="display: flex; align-items: center">
          <el-select
            v-model="type"
            placehoder="请选择"
            size="large"
            style="width: 180px; margin-right: 20px"
            @change="selectActionType"
          >
            <el-option v-for="item in selectType" :key="item.value" :label="item.name" :value="item.value" />
          </el-select>
          <!-- <el-cascader
            v-model="SearchKnowledgeSelectValue"
            :options="KnowledgeSelectList"
            :show-all-levels="false"
            placeholder=""
            @update:model-value="changeSearchKnowledge"
            :props="props1"
            v-if="type === '知识类型'"
          /> -->
          <el-input v-model="searchTitle" v-if="type === '知识标题'" style="width: 180px" />
          <el-input v-model="searchCreator" v-if="type === '创建者'" style="width: 180px" />
          <el-input v-model="searchKey" v-if="type === '关键字'" style="width: 180px" />
          <div v-if="type === '创建时间'">
            开始时间：
            <el-date-picker
              v-model="startDate"
              type="date"
              placeholder="选择日期"
              size="default"
              value-format="YYYY-MM-DD"
              :disabled-date="disabledDate"
              style="width: 180px"
            />
            结束时间:
            <el-date-picker
              v-model="endDate"
              type="date"
              placeholder="选择日期"
              size="default"
              value-format="YYYY-MM-DD"
              :disabled-date="disabledDate"
              style="width: 180px"
            />
          </div>
          <el-button type="primary" :icon="Search" @click="searchKnowledge" style="margin-left: 12px">搜索</el-button>
        </div>
      </div>
      <ProTable
        ref="proTable"
        :columns="columns"
        :request-api="getKnowledgeList"
        :data-callback="dataCallback"
        :init-param="initParam"
      >
        <template #tableHeader="scope">
          <div style="display: flex">
            <!-- <el-button type="primary" plain @click="addKnowledgeBtn">新增</el-button> -->
            <el-button
              type="danger"
              :disabled="!scope.isSelected"
              plain
              v-auth="'delete'"
              @click="delSelectItem(scope.selectedList)"
            >
              删除
            </el-button>
          </div>
        </template>
        <!-- 表格操作 -->
        <template #operation="scope">
          <el-button type="primary" link :icon="View" @click="seeDetails(scope.row)" v-auth="'view'">查看</el-button>
          <el-button type="primary" link :icon="EditPen" @click="editEvent(scope.row)" v-auth="'edit'">编辑</el-button>
          <el-button type="primary" link :icon="Delete" @click="deleteItem(scope.row)" v-auth="'delete'">删除</el-button>
        </template>
      </ProTable>
      <!-- <KnowledgeMask ref="knowledgeMask" /> -->
      <el-drawer v-model="dialogVisible" direction="rtl" size="1000" :title="knowledgeTitle" @close="handleClose">
        <div>
          <el-button type="primary" :icon="View" @click="submitKnowledge">保存</el-button>
          <el-button type="primary" :icon="EditPen" @click="dialogVisible = false">返回列表</el-button>
        </div>
        <div style="display: flex">
          <div>
            <h3>基本信息</h3>
            <el-form v-model="formData" label-position="left" style="width: 260px; margin-right: 10px" label-width="100px">
              <el-form-item label="标题" required>
                <el-input v-model="formData.title" placeholder="请输入知识标题" style="width: 200px" />
              </el-form-item>
              <el-form-item label="类型" required>
                <el-cascader
                  v-model="KnowledgeSelectValue"
                  :options="KnowledgeSelectList"
                  :show-all-levels="false"
                  placeholder=""
                  @update:model-value="changeKnowledge"
                  :props="props1"
                />
              </el-form-item>
              <el-form-item label="审核状态">
                <el-switch v-model="formData.checkStatus" />
              </el-form-item>
              <el-form-item label="关键字">
                <el-input v-model="formData.key" placeholder="请输入知识关键字" style="width: 200px" />
              </el-form-item>
              <el-form-item label="附件" v-if="knowledgeTitle === '新增知识'">
                <el-button type="primary" @click="addAttachment">选择附件</el-button>
              </el-form-item>
              <el-form-item label="已上传附件" v-if="knowledgeTitle === '新增知识'">
                <p v-for="(item, index) in attachmentListEdit" :key="item.aid">
                  <span
                    ><a :href="`/api/attachment!download.action?downloadAttachmentId=${item.aid}`">{{
                      item.attachmentName
                    }}</a></span
                  >
                  <span style="margin-left: 10px" @click="delFileOption(item.aid, index)">删除</span>
                </p>
              </el-form-item>
              <!-- <el-form-item label="关联服务">
              <el-input v-model="formData.title" placeholder="请输入知识标题" />
            </el-form-item> -->
            </el-form>
          </div>
          <div>
            <h3>知识明细</h3>
            <WangEditor v-model:value="content" height="400px" width="300px" />
          </div>
        </div>
      </el-drawer>
      <el-drawer v-model="dialogVisible2" direction="rtl" size="500" :title="knowledgeTitle">
        <el-form v-model="formDataDetail" label-position="left" style="width: 260px; margin-right: 10px" label-width="100px">
          <el-form-item label="标题">
            <p>{{ formDataDetail.title }}</p>
          </el-form-item>
          <el-form-item label="创建者">
            <p>{{ formDataDetail.creatorFullName }}</p>
          </el-form-item>
          <el-form-item label="录入时间">
            <p>{{ formDataDetail.addTime }}</p>
          </el-form-item>
          <el-form-item label="点击次数">
            <p>{{ formDataDetail.clickRate }}</p>
          </el-form-item>
          <el-form-item label="评价次数">
            <p>{{ formDataDetail.cishu }}</p>
          </el-form-item>
          <el-form-item label="引用数目">
            <p>{{ formDataDetail.serviceDirectoryItemNo }}</p>
          </el-form-item>
          <el-form-item label="关键字">
            <p>{{ formDataDetail.keyWords }}</p>
          </el-form-item>
          <el-form-item label="知识分类">
            <p>{{ formDataDetail.categoryName }}</p>
          </el-form-item>
          <el-form-item label="知识内容">
            <!-- <p>{{ formDataDetail.content }}</p> -->
            <div class="img" v-html="formDataDetail.content" @click="previewImage"></div>
          </el-form-item>
          <el-form-item label="附件">
            <p v-for="(item, index) in formDataDetail.attachments as any" :key="item.aid">
              <span
                ><a :href="`/api/attachment!download.action?downloadAttachmentId=${item.aid}`">{{ item.attachmentName }}</a></span
              >
              <span style="margin-left: 10px" @click="delFileOption(item.aid, index)">删除</span>
            </p>
          </el-form-item>
          <el-form-item label="星级">
            <el-rate v-model="formDataDetail.pingjiafenshu" />
          </el-form-item>
          <el-form-item label="评价内容">
            <el-input v-model="formDataDetail.remark" placeholder="请输入评价内容" />
          </el-form-item>
          <el-form-item label="操作">
            <el-button type="primary" :icon="Select" @click="subScore">提交评价</el-button>
          </el-form-item>
        </el-form>
        <div v-for="item in scoreValue" :key="item.stars">
          <p>评价人:{{ item.creator }}</p>
          <p>评价内容:{{ item.remark }}</p>
          <p><el-rate :model-value="Number(item.stars)" disabled /></p>
        </div>
      </el-drawer>
    </div>
    <ImportExcel ref="dialogRef" />
    <el-dialog v-model="previewImg" title="图片预览" fullscreen>
      <img :src="previewImgUrl" />
    </el-dialog>
  </div>
</template>
<script setup lang="ts" name="knowledge">
import { ref, reactive, onMounted, toRefs, watch } from "vue";
import ProTable from "@/components/ProTable/index.vue";
import TreeFilter from "@/components/TreeFilter/treeFilter.vue";
import { ProTableInstance, ColumnProps } from "@/components/ProTable/interface";
import { Delete, EditPen, View, Search, Select } from "@element-plus/icons-vue";
import KnowledgeMask from "./components/knowledgeMask.vue";
import { getKnowledgeCategoryTree } from "@/api/modules/dictionary";
import {
  getKnowledgeList,
  checkKnowledge,
  addKnowledge,
  uploadFile,
  delKnowledge,
  getKnowledgeInfo,
  editKnowledgeSubmit,
  getKnowledgeScore,
  submitKnowledgeScore,
  editAddAttachment,
  delFile
} from "@/api/modules/knowledge";
import type { FormProps } from "element-plus";
import WangEditor from "@/components/WangEditor/index.vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { useUserStore } from "@/stores/modules/user";
import ImportExcel from "@/views/tools/uploadFile/index.vue";
onMounted(() => {
  proTable.value?.getTableList();
  knowledgeList();
});
const userStore = useUserStore();
const username = userStore.username;
const initParam = reactive({
  knowledgeId: "",
  knowledgeName: "",
  knowledgeTitle: "",
  knowledgeCreator: "",
  startTime: "",
  endTime: "",
  keyWord: ""
});
const KnowledgeSelectValue = ref();
const KnowledgeSelectList = ref<any>([]);
const knowledgeIdCategoryNo = ref("");
const treeFilterData = ref<any>([]);
const props1 = {
  checkStrictly: true,
  label: "data",
  value: "attr"
};
const knowledgeList = async () => {
  const data = (await getKnowledgeCategoryTree()) as any;
  treeFilterData.value = [];
  treeFilterData.value.push(data);
  KnowledgeSelectList.value = [];
  KnowledgeSelectList.value = data?.children;
  // KnowledgeSelectList.value.push(data);
  console.log(data);
};
const changeKnowledge = (val: any) => {
  console.log(val[0].id, KnowledgeSelectValue.value);
  knowledgeIdCategoryNo.value = val[0].id;
};
const changeTreeFilter = (val: any) => {
  if (val instanceof Array) {
    return;
  }
  initParam.knowledgeId = val.id.id || "";
  initParam.knowledgeName = val.label;
  console.log(initParam.knowledgeName, initParam.knowledgeId);
  proTable.value?.getTableList();
};
// ProTable 实例
const proTable = ref<ProTableInstance>();
// 表格配置项
const columns = reactive<ColumnProps[]>([
  { type: "selection", fixed: "left" },
  { prop: "knowledgeServiceName", label: "关联服务", fixed: "left" },
  { prop: "title", label: "标题" },
  { prop: "creatorFullName", label: "创建者" },
  { prop: "categoryName", label: "知识分类" },
  { prop: "addTime", label: "创建时间" },
  { prop: "lastUpdateTime", label: "更新时间" },
  { prop: "cishu", label: "评价次数" },
  { prop: "pingjiafenshu", label: "平均分" },
  {
    prop: "knowledgeStatus",
    label: "状态",
    render(h) {
      switch (h.row.knowledgeStatus) {
        case "0":
          return "审核中";
        case "1":
          return "正常";
        default:
          return "未知";
      }
    }
  },
  { prop: "operation", label: "操作", fixed: "right", width: 230 }
]);
const dataCallback = (data: any) => {
  return {
    list: data.data,
    total: data.totalSize,
    pageNum: data.page,
    pageSize: data.rows
  };
};
const dialogVisible = ref(false);
const knowledgeTitle = ref("");
const labelPosition = ref<FormProps["labelPosition"]>("right");
const formData = reactive({
  title: "",
  type: "",
  checkStatus: false,
  key: ""
});
const content = ref("");
const addKnowledgeBtn = () => {
  dialogVisible.value = true;
  knowledgeTitle.value = "新增知识";
};
// 添加附件
const attachmentList = ref<any>([]);
const attachmentStrArr = ref<any[]>([]);
const attachmentStr = ref("");
const attachmentStrEdit = ref("");
const uploadFileRes = async (param: any) => {
  let res = JSON.parse(JSON.stringify(param));
  attachmentStrArr.value.push(res.fileName + "==" + res.msg + "==" + res.fileSize + "-s-");
  // attachmentStr.value += res.fileName + "==" + res.msg + "==" + res.fileSize + "-s-";
  attachmentStrArr.value.forEach(item => {
    attachmentStr.value += item;
  });
  let attachment = {
    fileName: res.fileName,
    attachmentStr: attachmentStr.value
  };
  attachmentListEdit.value.push({
    attachmentName: res.fileName,
    url: res.msg
  });
  attachmentList.value.push(attachment);
};
const dialogRef = ref<InstanceType<typeof ImportExcel> | null>(null);
const addAttachment = () => {
  const params = {
    title: "",
    tempApi: uploadFile,
    importApi: uploadFile,
    addAttachmentMethod: uploadFileRes
  };
  dialogRef.value?.acceptParams(params);
};

const submitKnowledge = async () => {
  if (knowledgeTitle.value === "新增知识") {
    if (formData.title === "") {
      // ElMessage.error("请输入知识标题");
      ElMessage({
        customClass: "customMsgCls",
        message: "请输入知识标题",
        type: "error",
        appendTo: document.body
      });
      return;
    }
    const checkParams = {
      "knowledgeDto.title": formData.title
    };
    const params = {
      "knowledgeDto.creator": userStore.username,
      "knowledgeDto.title": formData.title,
      "knowledgeDto.categoryNo": knowledgeIdCategoryNo.value,
      "knowledgeDto.keyWords": formData.key,
      "knowledgeDto.attachmentStr": attachmentStr.value,
      "knowledgeDto.knowledgeStatus": formData.checkStatus ? 1 : 0,
      "knowledgeDto.content": content.value
    };
    const res = await checkKnowledge(checkParams);
    if ((res as any) === null) {
      if (content.value === "") {
        //ElMessage.error("请输入知识内容");
        ElMessage({
          customClass: "customMsgCls",
          message: "请输入知识内容",
          type: "error",
          appendTo: document.body
        });
        return;
      } else {
        try {
          const data = (await addKnowledge(params)) as any;
          console.log(data);
          if (data) {
            ElMessage.success("新增成功");
            dialogVisible.value = false;
            proTable.value?.getTableList();
            formData.title = "";
            knowledgeIdCategoryNo.value = "";
            formData.key = "";
            formData.checkStatus = false;
            content.value = "";
          }
        } catch (error) {
          console.log(error);
          ElMessage.error("网络错误");
        }
      }
    } else {
      ElMessage.error("知识标题已存在");
    }
  } else if (knowledgeTitle.value === "编辑知识") {
    if (formData.title === "") {
      ElMessage.error("请输入知识标题");
      return;
    }
    const params = {
      "knowledgeDto.kid": kid.value,
      "knowledgeDto.addTime": getCurrentTime(),
      "knowledgeDto.creator": userStore.username,
      "knowledgeDto.title": formData.title,
      "knowledgeDto.categoryNo": knowledgeIdCategoryNo.value,
      "knowledgeDto.keyWords": formData.key,
      "knowledgeDto.attachmentStr": attachmentStr.value,
      "knowledgeDto.knowledgeStatus": formData.checkStatus ? 1 : 0,
      "knowledgeDto.content": content.value
    };
    if (content.value === "") {
      ElMessage.error("请输入知识内容");
      return;
    } else {
      try {
        const data = (await editKnowledgeSubmit(params)) as any;
        console.log(data);
        if (data === null) {
          ElMessage.success("编辑成功");
          dialogVisible.value = false;
          proTable.value?.getTableList();
          formData.title = "";
          knowledgeIdCategoryNo.value = "";
          formData.key = "";
          formData.checkStatus = false;
          content.value = "";
        }
      } catch (error) {
        console.log(error);
        ElMessage.error("网络错误");
      }
    }
  }
};
const handleClose = () => {
  formData.title = "";
  knowledgeIdCategoryNo.value = "";
  formData.key = "";
  formData.checkStatus = false;
  content.value = "";
  attachmentStr.value = "";
  attachmentStrArr.value = [];
  attachmentListEdit.value = [];
};
const getCurrentTime = () => {
  const now = new Date();
  const year = String(now.getFullYear()); // 获取最后两位年份
  const month = String(now.getMonth() + 1).padStart(2, "0"); // 月份从0开始
  const day = String(now.getDate()).padStart(2, "0");
  const hours = String(now.getHours()).padStart(2, "0");
  const minutes = String(now.getMinutes()).padStart(2, "0");
  const seconds = String(now.getSeconds()).padStart(2, "0");
  return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
};
//编辑知识库
const kid = ref("");
const attachmentListEdit = ref<any>([]);
const editEvent = async (row: any) => {
  console.log(row);
  if (row) {
    kid.value = row.kid;
    dialogVisible.value = true;
    knowledgeTitle.value = "编辑知识";
    formData.title = row.title;
    KnowledgeSelectList.value.forEach(item => {
      if (item.attr.cname === row.categoryName) {
        KnowledgeSelectValue.value = [item.attr];
      }
    });

    // KnowledgeSelectValue.value = [KnowledgeSelectList.value[1].attr];
    formData.key = row.keyWords;
    formData.checkStatus = row.knowledgeStatus === "1" ? true : false;
    content.value = row.content;
    console.log(KnowledgeSelectList.value, KnowledgeSelectValue.value);
    const res = (await getKnowledgeInfo(row.kid)) as any;
    attachmentListEdit.value = res.attachments;
  }
};
//查看知识库
const dialogVisible2 = ref(false);
const formDataDetail = reactive({
  title: "",
  creatorFullName: "",
  addTime: "",
  clickRate: "",
  cishu: "",
  serviceDirectoryItemNo: "",
  keyWords: "",
  categoryName: "",
  content: "",
  attachments: [],
  pingjiafenshu: 0,
  remark: ""
});
const scoreValue = ref<any>([]);
const seeDetails = async (row: any) => {
  dialogVisible2.value = true;
  knowledgeTitle.value = "知识明细";
  console.log(row);
  if (row) {
    kid.value = row.kid;
    const res = (await getKnowledgeInfo(row.kid)) as any;
    console.log(res);
    formDataDetail.title = res.title;
    formDataDetail.creatorFullName = res.creatorFullName;
    formDataDetail.addTime = res.addTime;
    formDataDetail.clickRate = res.clickRate;
    formDataDetail.cishu = res.cishu;
    formDataDetail.serviceDirectoryItemNo = res.serviceDirectoryItemNo;
    formDataDetail.keyWords = res.keyWords;
    formDataDetail.categoryName = res.categoryName;
    formDataDetail.content = res.content;
    if (formDataDetail.content.includes("<img")) {
      formDataDetail.content = formDataDetail.content.replace(
        /<img[^>]/g,
        '<img style="width: 120px;border: 1px solid #ccc;margin-right: 10px;"'
      );
    }
    formDataDetail.attachments = res.attachments;
    const score = (await getKnowledgeScore(row.kid)) as any;
    console.log(score);
    scoreValue.value = score;
  }
};
//描述包含图片点击预览
const previewImgUrl = ref("");
const previewImg = ref(false);
const previewImage = event => {
  const target = event.target;
  if (target.tagName === "IMG") {
    previewImg.value = true;
    previewImgUrl.value = target.src;
  }
};
const subScore = async () => {
  const params = {
    "knowledgeDto.creator": userStore.username,
    "knowledgeDto.kid": kid.value,
    score: formDataDetail.pingjiafenshu,
    "knowledgeDto.stars": formDataDetail.pingjiafenshu,
    "knowledgeDto.remark": formDataDetail.remark
  };
  const res = (await submitKnowledgeScore(params)) as any;
  if (res === null) {
    ElMessage.success("评价成功");
    dialogVisible2.value = false;
    formDataDetail.pingjiafenshu = 0;
    formDataDetail.remark = "";
  }
};
//删除知识库
const deleteItem = (row: any) => {
  ElMessageBox.confirm("确实要删除选择的知识吗？", "删除确认", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
    center: true
  })
    .then(async () => {
      let params = "nos=" + row.kid;
      try {
        const data = (await delKnowledge(params)) as any;
        if (data === null) {
          ElMessage.success("删除成功");
          proTable.value?.clearSelection();
          proTable.value?.getTableList();
        }
      } catch {
        ElMessage.error("此数据存在相关联的数据，不能删除");
      }
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "取消删除"
      });
    });
};
//批量删除
const delSelectItem = e => {
  console.log(e);
  ElMessageBox.confirm("确实要删除选择的知识库吗？", "删除确认", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
    center: true
  })
    .then(async () => {
      let params = "";
      e.forEach(item => {
        params += "nos=" + item.kid + "&";
      });
      try {
        const data = (await delKnowledge(params)) as any;
        if (data === null) {
          ElMessage.success("删除成功");
          proTable.value?.clearSelection();
          proTable.value?.getTableList();
        }
      } catch {
        ElMessage.error("此数据存在相关联的数据，不能删除");
      }
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "取消删除"
      });
    });
};
//搜索
const type = ref("");
const SearchKnowledgeSelectValue = ref();
const searchEventId = ref("");
const searchCategory = ref();
const changeSearchKnowledge = e => {
  searchEventId.value = e[0].id;
  searchCategory.value = e[0].cname;
};
const searchTitle = ref("");
const searchCreator = ref("");
const searchKey = ref();
const startDate = ref("");
const endDate = ref("");
const disabledDate = (time: Date) => {
  return time.getTime() > Date.now();
};
const selectType = [
  // { name: "知识类型", value: "categoryName" },
  { name: "知识标题", value: "title" },
  { name: "创建者", value: "creator" },
  { name: "关键字", value: "key" },
  { name: "创建时间", value: "time" }
];
const selectActionType = e => {
  console.log(e);
  // 清空 initParam
  initParam.knowledgeId = "";
  initParam.knowledgeName = "";
  initParam.knowledgeTitle = "";
  initParam.knowledgeCreator = "";
  initParam.startTime = "";
  initParam.endTime = "";
  initParam.keyWord = "";
  //清空输入框的值
  searchTitle.value = "";
  searchCreator.value = "";
  searchKey.value = "";
  startDate.value = "";
  endDate.value = "";
  switch (e) {
    case "categoryName":
      type.value = "知识类型";
      initParam.knowledgeId = searchEventId.value;
      initParam.knowledgeName = searchCategory.value;
      break;
    case "title":
      type.value = "知识标题";
      break;
    case "creator":
      type.value = "创建者";
      break;
    case "key":
      type.value = "关键字";
      break;
    case "time":
      type.value = "创建时间";
  }
};
const searchKnowledge = async e => {
  if (type.value === "创建时间") {
    initParam.startTime = startDate.value;
    initParam.endTime = endDate.value;
  } else if (type.value === "知识标题") {
    initParam.knowledgeTitle = searchTitle.value;
  } else if (type.value === "创建者") {
    initParam.knowledgeCreator = searchCreator.value;
  } else if (type.value === "关键字") {
    initParam.keyWord = searchKey.value;
  }
};
//删除附件
const delFileOption = async (e, index) => {
  const params = {
    kid: kid.value,
    aid: e
  };
  // const res = (await delFile(params)) as any;
  // if (res === null) {
  // }
  ElMessageBox.confirm("确实要删除选择的数据吗？", "删除确认", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
    center: true
  })
    .then(async () => {
      if (knowledgeTitle.value === "新增知识") {
        // 1. 删除 attachmentStrArr.value 的对应项
        attachmentStrArr.value.splice(index, 1);
        // 2. 删除 fileList.value 的对应项
        attachmentListEdit.value.splice(index, 1);
        // 3. 重新拼接 attachmentStr.value
        attachmentStr.value = "";
        attachmentStrArr.value.forEach(item => {
          attachmentStr.value += item;
        });
      } else {
        try {
          const data = (await delFile(params)) as any;
          if (data === null) {
            ElMessage.success("删除成功");
            const res = (await getKnowledgeInfo(kid.value)) as any;
            formDataDetail.title = res.title;
            formDataDetail.creatorFullName = res.creatorFullName;
            formDataDetail.addTime = res.addTime;
            formDataDetail.clickRate = res.clickRate;
            formDataDetail.cishu = res.cishu;
            formDataDetail.serviceDirectoryItemNo = res.serviceDirectoryItemNo;
            formDataDetail.keyWords = res.keyWords;
            formDataDetail.categoryName = res.categoryName;
            formDataDetail.content = res.content;
            if (formDataDetail.content.includes("<img")) {
              formDataDetail.content = formDataDetail.content.replace(
                /<img[^>]/g,
                '<img style="width: 120px;border: 1px solid #ccc;margin-right: 10px;"'
              );
            }
            formDataDetail.attachments = res.attachments;
            const score = (await getKnowledgeScore(kid.value)) as any;
            console.log(score);
            scoreValue.value = score;
            attachmentListEdit.value = res.attachments;
          }
        } catch {
          ElMessage.error("此数据存在相关联的数据，不能删除");
        }
      }
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "取消删除"
      });
    });
};
</script>
<style lang="scss" scoped>
h3 {
  margin: 0;
}
p {
  margin: 0;
}
.imgBox {
  width: 1000px !important;
}
.customMsgCls {
  z-index: 20011 !important;
}
</style>
